import '~/style/three/house.less'
import LoadHead from '~/js/loadHead.js'

class ThreeHouse extends LoadHead{

  constructor () {
    super()
    this.scene = null
    this.camera = null
    this.renderer = null
    this.init()
  }

  init () {
    this.initThree()
    this.render()
  }

  initThree () {
    const innerWidth = $('.view-three-house').innerWidth()
    const innerHeight = $('.view-three-house').innerHeight()
    this.scene = new THREE.Scene({background: 0x00ffff});
    this.scene.background = new THREE.Color( 0xe3e3e3 )
    this.camera = new THREE.PerspectiveCamera(75, innerWidth / innerHeight, 0.1, 1000);
    this.renderer = new THREE.WebGLRenderer();
    this.renderer.setSize( innerWidth, innerHeight );
    $('.view-three-house').append( this.renderer.domElement );
    let geometry = new THREE.BoxGeometry( 1, 5, 1 );
    let material = new THREE.MeshBasicMaterial({ color: 0x777e8c });
    let cube = new THREE.Mesh( geometry, material );
    this.scene.add( cube );
    this.camera.position.z = 5;
  }
  
  render () {
    requestAnimationFrame( this.render );
	  this.renderer.render( this.scene, this.camera );
  }

}

new ThreeHouse()

